<template>
  <div>

  </div>
</template>

<script setup>
import * as Cesium from 'cesium';

function initPrimitive (Viewer) {
  // 立方体半径大小
  const halfSize = 50;

  // 定义立方体的8个顶点坐标
  const positions = new Float64Array([
    -halfSize, -halfSize, -halfSize, // 0
    halfSize, -halfSize, -halfSize, // 1
    halfSize, halfSize, -halfSize, // 2
    -halfSize, halfSize, -halfSize, // 3
    -halfSize, -halfSize, halfSize, // 4
    halfSize, -halfSize, halfSize, // 5
    halfSize, halfSize, halfSize, // 6
    -halfSize, halfSize, halfSize, // 7
  ]);

  // 定义立方体的12个三角形面（每个面2个三角形）
  const indices = new Uint16Array([
    0, 1, 2, 0, 2, 3, // 底面
    4, 5, 6, 4, 6, 7, // 顶面
    0, 1, 5, 0, 5, 4, // 前面
    1, 2, 6, 1, 6, 5, // 右面
    2, 3, 7, 2, 7, 6, // 后面
    3, 0, 4, 3, 4, 7, // 左面
  ]);

  // 设置立方体位置 (以北京为中心)
  const position = Cesium.Cartesian3.fromDegrees(116.3974, 39.9093, 500);

  // 创建变换矩阵，用于定位立方体
  const modelMatrix = Cesium.Transforms.eastNorthUpToFixedFrame(position);

  // 创建立方体primitive
  const cubePrimitive = new Cesium.Primitive({
    geometryInstances: new Cesium.GeometryInstance({
      geometry: new Cesium.Geometry({
        attributes: {
          position: new Cesium.GeometryAttribute({
            componentDatatype: Cesium.ComponentDatatype.DOUBLE,
            componentsPerAttribute: 3,
            values: positions,
          }),
        },
        indices: indices,
        primitiveType: Cesium.PrimitiveType.TRIANGLES,
        boundingSphere: Cesium.BoundingSphere.fromVertices(positions),
        vertexFormat: Cesium.VertexFormat.ALL,
      }),
      attributes: {
        color: Cesium.ColorGeometryInstanceAttribute.fromColor(
          new Cesium.Color(1.0, 0.0, 0.0, 0.8) // 红色，80% 透明度
        ),
      },
      modelMatrix: modelMatrix,
    }),
    appearance: new Cesium.PerInstanceColorAppearance({
      flat: true,
      translucent: true,
      vertexFormat: Cesium.VertexFormat.ALL,
    }),
    asynchronous: false,
    releaseGeometryInstances: false,
    renderState: {
      depthTest: {
        enabled: true,
      },
      depthMask: false,
      blending: Cesium.BlendingState.ALPHA_BLEND,
    },
  });

  // 将立方体添加到场景中
  Viewer.scene.primitives.add(cubePrimitive);

  // 将相机飞向立方体位置
  Viewer.camera.flyTo({
    destination: Cesium.Cartesian3.fromDegrees(116.3974, 39.9093, 1000),
    duration: 2.0
  });

  setInterval(() => {
    // cubePrimitive
  }, 1000);

  console.log('红色立方体已创建并添加到场景中');
}

defineExpose({
  initPrimitive
})
</script>

<style lang="scss" scoped></style>